<!doctype html>
<html class="no-js">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Amaze UI Widget</title>
  <meta name="description" content="">
  <meta name="keywords" content="">
  <meta name="viewport"
        content="width=device-width, initial-scale=1">
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-siteapp"/>
  <link rel="icon" type="image/png" href="assets/i/favicon.png">
  <link rel="stylesheet" href="assets/css/amazeui.min.css">
  <link rel="stylesheet" href="assets/css/app.css">
</head>
<body>
<!--[if lte IE 9]>
<p class="browsehappy">你正在使用<strong>过时</strong>的浏览器，Amaze UI 不提供支持。 请 <a
  href="http://browsehappy.com/" target="_blank">升级浏览器</a>
  以获得更好的体验！</p>
<![endif]-->

<script type="text/x-handlebars-template" id="amz-tpl">
  {{>header header}}

  {{>menu menu}}

  {{>slider slider}}

  {{>list_news list1}}

  {{>gallery gallery}}

  {{>list_news list2}}

  {{>footer footer}}

  {{>navbar navbar}}
</script>

<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/amazeui.js"></script>
<script src="assets/js/handlebars.min.js"></script>
<script src="assets/js/amazeui.widgets.helper.js"></script>
<script>
  var $tpl = $('#amz-tpl');
  var source = $tpl.text();
  var template = Handlebars.compile(source);
  var data = {
    header: {
      "content": {
        "title": "Amaze UI"
      }
    },

    menu: {
      "options": {
        "cols": "1"
      },
      "content": [
        {
          "link": "##",
          "title": "公司",
          "subCols": 2,
          "channelLink": "进入栏目 »",
          "subMenu": [
            {
              "link": "##",
              "title": "公司"
            },
            {
              "link": "##",
              "title": "人物"
            },
            {
              "link": "##",
              "title": "趋势"
            },
            {
              "link": "##",
              "title": "投融资"
            },
            {
              "link": "##",
              "title": "创业公司"
            },
            {
              "link": "##",
              "title": "创业人物"
            }
          ]
        },
        {
          "link": "##",
          "title": "人物",
          "subCols": 3,
          "subMenu": [
            {
              "link": "##",
              "title": "公司"
            },
            {
              "link": "##",
              "title": "人物"
            },
            {
              "link": "##",
              "title": "趋势"
            },
            {
              "link": "##",
              "title": "投融资"
            },
            {
              "link": "##",
              "title": "创业公司"
            },
            {
              "link": "##",
              "title": "创业人物"
            }
          ]
        },
        {
          "link": "#c3",
          "title": "趋势",
          "subCols": 4,
          "channelLink": "泥煤 »",
          "subMenu": [
            {
              "link": "##",
              "title": "公司"
            },
            {
              "link": "##",
              "title": "人物"
            },
            {
              "link": "##",
              "title": "趋势"
            },
            {
              "link": "##",
              "title": "投融资"
            },
            {
              "link": "##",
              "title": "创业公司"
            },
            {
              "link": "##",
              "title": "创业人物"
            }
          ]
        },
        {
          "link": "##",
          "title": "投融资",
          "subCols": 3,
          "subMenu": [
            {
              "link": "##",
              "title": "公司"
            },
            {
              "link": "##",
              "title": "人物"
            },
            {
              "link": "##",
              "title": "趋势"
            },
            {
              "link": "##",
              "title": "投融资"
            },
            {
              "link": "##",
              "title": "创业公司"
            },
            {
              "link": "##",
              "title": "创业人物"
            }
          ]
        },
        {
          "link": "##",
          "title": "创业公司"
        },
        {
          "link": "##",
          "title": "创业人物"
        }
      ],
      "theme": "offcanvas1"
    },

    slider: {
      "theme": "a2",
      //"sliderConfig": "{\"directionNav\":false}",
      "content": [
        {
          "img": "http://s.amazeui.org/media/i/demos/bing-1.jpg"
        },
        {
          "img": "http://s.amazeui.org/media/i/demos/bing-2.jpg"
        },
        {
          "img": "http://s.amazeui.org/media/i/demos/bing-3.jpg"
        },
        {
          "img": "http://s.amazeui.org/media/i/demos/bing-4.jpg"
        }
      ]
    },

    list1: {
      "options": {
        "type": "thumb",
        "thumbPosition": "left"
      },
      "content": {
        "header": {
          "title": "栏目标题",
          "link": "###",
          "moreText": "更多 >>",
          "morePosition": "top"
        },
        "main": [
          {
            "title": "我很囧，你保重....晒晒旅行中的那些囧！",
            "link": "http://www.douban.com/online/11614662/",
            "desc": "囧人囧事囧照，人在囧途，越囧越萌。标记《带你出发，陪我回家》http://book.douban.com/subject/25711202/为“想读”“在读”或“读过”，有机会获得此书本活动进行3个月，每月送出三本书。会有不定期bonus！",
            "img": "http://img5.douban.com/lpic/o636459.jpg"
          },
          {
            "title": "我最喜欢的一张画",
            "link": "http://www.douban.com/online/11624755/",
            "desc": "你最喜欢的艺术作品，告诉大家它们的------名图画，色彩，交织，撞色，线条雕塑装置当代古代现代作品的照片美我最喜欢的画群296795413进群发画，少说多发图，",
            "img": "http://img3.douban.com/lpic/o637240.jpg"
          },
          {
            "title": "“你的旅行，是什么颜色？” 晒照片，换北欧梦幻极光之旅！",
            "link": "http://www.douban.com/online/11645411/",
            "desc": "还在苦恼圣诞礼物再也玩儿不出新意？快来抢2013最炫彩的跨国圣诞礼物！【参与方式】1.关注“UniqueWay无二之旅”豆瓣品牌小站http://brand.douban.com/uniqueway/2.上传一张**本人**在旅行中色彩最浓郁、最丰富的照片（色彩包含取景地、周边事物、服装饰品、女生彩妆等等，发挥你们无穷的创意想象力哦！^^）一定要有本人出现喔！3. 在照片下方，附上一句旅行宣言作为照片说明。 成功参与活动！* 听他们刚才说，上传照片的次",
            "img": ""
          }
        ]
      }
    },

    gallery: {
      "options": {
        "cols": 2,
        "gallery": true
      },
      "content": [
        {
          "img": "http://s.amazeui.org/media/i/demos/bing-1.jpg",
          "link": "http://s.amazeui.org/media/i/demos/bing-1.jpg",
          "title": "远方 有一个地方 那里种有我们的梦想",
          "desc": "2375-09-26"
        },
        {
          "img": "http://s.amazeui.org/media/i/demos/bing-2.jpg",
          "link": "http://s.amazeui.org/media/i/demos/bing-2.jpg",
          "title": "某天 也许会相遇 相遇在这个好地方",
          "desc": "2375-09-26"
        },
        {
          "img": "http://s.amazeui.org/media/i/demos/bing-3.jpg",
          "link": "http://s.amazeui.org/media/i/demos/bing-3.jpg",
          "title": "不要太担心 只因为我相信",
          "desc": "2375-09-26"
        },
        {
          "img": "http://s.amazeui.org/media/i/demos/bing-4.jpg",
          "link": "http://s.amazeui.org/media/i/demos/bing-4.jpg",
          "title": "终会走过这条遥远的道路",
          "desc": "2375-09-26"
        }
      ]
    },

    list2: {
      "content": {
        "header": {
          "title": "栏目标题",
          "link": "###",
          "moreText": "更多 >>",
          "morePosition": "top"
        },
        "main": [
          {
            "title": "我很囧，你保重....晒晒旅行中的那些囧！",
            "link": "http://www.douban.com/online/11614662/",
            "date": "2013-09-18"
          },
          {
            "title": "我最喜欢的一张画",
            "link": "http://www.douban.com/online/11624755/",
            "date": "2013-10-14"
          },
          {
            "title": "“你的旅行，是什么颜色？” 晒照片，换北欧梦幻极光之旅！",
            "link": "http://www.douban.com/online/11645411/",
            "date": "2013-11-18"
          }
        ]
      }
    },

    footer: {
      "options": {
        "modal": true,
        "techSupportCo": "XXX",
        "techSupportSite": "http://www.yunshipei.com/"
      },
      "content": {
        "owner": "云适配",
        "companyInfo": [
          {
            "detail": "CopyRight©2013  AllMobilize Inc."
          },
          {
            "detail": "京ICP备13033158"
          }
        ]
      }
    },

    navbar: {
      "options": {
        "cols": "4",
        "iconpos": "top"
      },
      "content": [
        {
          "title": "一键拨号",
          "link": "tel:123456789",
          "icon": "phone",
          "dataApi": ""
        },
        {
          "title": "一键分享",
          "link": "",
          "icon": "share-square-o",
          "dataApi": "data-am-navbar-share"
        },
        {
          "title": "二维码",
          "link": "",
          "icon": "qrcode",
          "dataApi": "data-am-navbar-qrcode"
        },
        {
          "title": "关于我们",
          "link": "http://yunshipei.com",
          "icon": "user-md",
          "dataApi": ""
        },
        {
          "title": "下载说明",
          "link": "http://yunshipei.com",
          "icon": "download",
          "dataApi": ""
        },
        {
          "title": "联系我们",
          "link": "http://yunshipei.com",
          "icon": "location-arrow",
          "dataApi": ""
        }
      ]
    }
  };
  var html = template(data);

  $tpl.before(html);

  /*
  // 如果 Handlebars 渲染出来的 HTML 在 DOM ready 事件之后插入文档，需要手动初始化组件
   $.each(['slider', 'menu', 'gallery', 'footer', 'navbar'], function(i, m) {
     var module = $.AMUI[m];
     module && module.init && module.init();
   })
   */
</script>
</body>
</html>
